<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<script src="layui/layui.js"></script>
<script src="js/jquery-2.0.3.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
	<form>
		<div class="layui-upload">
			<input type="text" name="username" id="username"> <br />
			<button type="button" class="layui-btn layui-btn-normal"
				name="headimg" id="headimg">选择文件</button>
			<button type="button" class="layui-btn" id="test9">开始上传</button>
			预览图：
			<div class="layui-upload-list" id="demo2"></div>
		</div>

	</form>

	<script>
		layui
				.use(
						'upload',
						function() {
							var upload = layui.upload;

							//选完文件后不自动上传
							upload
									.render({
										elem : '#headimg',
										url : 'UploadServlet2' //改成您自己的上传接口
										,
										auto : false
										//,multiple: true
										,
										accept : 'images',
										data:{},
										acceptMime : 'image/*',
										size : '1024*5',
										bindAction : '#test9',
										before : function(obj) {
											//预读本地文件示例，不支持ie8
											obj
													.preview(function(index,
															file, result) {
														$('#demo2')
																.append(
																		'<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
													});
											 this.data.username= $('#username').val(); //设置表单文本框的值一同提交
										},
										done : function(res) {
											console.log(res)
											console.log();
											if (res.msg == "ok") {
												layer.msg('上传成功');
											} else {
												layer.msg('上传失败');
											}

										}
									});

						});
	</script>
</body>
</html>